<template>
	<view class="content">
		<view class="head" @tap="onSwitch">
			<!-- <text class="id==0?'active':''" data-id="0">我的拼团</text>
	    <text class="id==1?'active':''" data-id="1">我的秒杀</text>
	    <text class="id==2?'active':''" data-id="2">我的砍价</text>
	    <text class="id==3?'active':''" data-id="3">历史订单</text> -->
			<text :class="[id==index?'order-active':'']" v-for="(item,index) in list" :key="index"
				:data-id="index">{{item}}</text>
		</view>
		<view class="main">
			<swiper :style="[{'height':swiperHeight}]" :current="id" @change="onSwiper">
				<swiper-item item-id="0">
					<view v-if="groupList!=''">
						<view class="order-box" v-for="(item,index) in groupList" :key="index">
							<text class="tiem">{{item.Time}}</text>
							<view class="information" bindtap="onJump" :data-AcType="item.AcType"
								:data-ChildId="item.ChildId" :data-Acid="item.Acid" :data-IsDelete="item.IsDelete"
								:data-ProWxid="item.ProWxid">
								<image class="order-img" mode="aspectFit" :src="item.Img"></image>
								<view class="mation">
									<text class="title">{{item.Name}}</text>
									<view class="price">
										<text>底价:¥{{item.AcPrice}}</text>
										<text>原价:¥{{item.Price}}</text>
									</view>
								</view>
							</view>
							<view class="explain" v-if="item.OrderStatus=='新单'">
								<text class="prompt exp-text1"
									v-if="item.IsDelete!=true">待分享，差{{item.GroupQty-item.AcQty}}人</text>
								<text class="prompt exp-text2" wx:else>活动已结束</text>
								<view class="btu" v-if="item.IsDelete!=true">
									<button class="order-btu2 button" :data-AcType="item.AcType"
										:data-ChildId="item.ChildId" :data-Acid="item.Acid" :data-id="index"
										:data-user="item.CreateUid" :data-ProWxid="item.ProWxid"
										open-type='share'>邀请拼单</button>
								</view>
							</view>
							<view class="explain" v-else-if="item.OrderStatus=='超时'">
								<text class="prompt exp-text2">拼团失败，未在活动时间内完成拼团 <text
										v-if="item.IsDelete==true">(活动已结束)</text></text>
								<view class="btu">
									<button class="order-btu3 button" :data-id="item.AcType" :data-acid="item.Acid"
										bindtap="onAgain">重拼一次</button>
								</view>
							</view>
							<view class="explain" v-else-if="item.OrderStatus=='取消'">
								<text class="prompt exp-text2">拼团失败，活动已取消</text>
							</view>
							<view class="explain" v-else>
								<text class="prompt exp-text2">拼单成功 <text
										v-if="item.IsDelete==true">(活动已结束)</text></text>
								<view class="btu" v-if="item.IsDelete!=true">
									<button class="order-btu3 button" :data-FItemId="item.OrderId"
										bindtap="onHistory">查看核销码</button>
								</view>
							</view>
						</view>
					</view>
					<view class="order-box" v-else>暂无数据</view>
				</swiper-item>
				<swiper-item item-id="1">
					<view v-if="seckillList!=''">
						<view class="order-box" v-for="(item,index) in seckillList" :key="index">
							<text class="tiem">{{item.Time}}</text>
							<view class="information" :data-AcType="item.AcType" :data-ChildId="item.GoodsId"
								:data-Acid="item.Acid" :data-IsDelete="item.IsDelete" :data-ProWxid="item.ProWxid"
								bindtap="onJump">
								<image class="order-img" mode="aspectFit" :src="item.Img"></image>
								<view class="mation">
									<text class="title">{{item.Name}}</text>
									<view class="price">
										<text>底价:¥{{item.AcPrice}}</text>
										<text>原价:¥{{item.Price}}</text>
									</view>
								</view>
							</view>
							<view v-if="item.IsDelete==false">
								<view class="explain" v-if="item.OrderStatus=='新单'">
									<text class="prompt exp-text1">秒杀中 <text
											v-if="item.IsDelete==true">(活动已结束)</text></text>
									<view class="btu">
									</view>
								</view>
								<view class="explain" v-else-if="item.OrderStatus=='超时'">
									<text class="prompt exp-text2">秒杀失败 <text
											v-if="item.IsDelete==true">(活动已结束)</text></text>
									<view class="btu" v-if="item.IsDelete!=true">
										<button class="seckill-but2 button" :data-id="item.AcType"
											:data-acid="item.Acid" bindtap="onAgain">重秒一次</button>
									</view>
								</view>
								<view class="explain" v-else-if="item.OrderStatus=='成功'">
									<text class="prompt exp-text1">秒杀成功,等待支付</text>
									<view class="btu">
										<button class="seckill-but2 button" :data-AcType="item.AcType" :data-id="index"
											:data-ProWxid="item.ProWxid" bindtap="onWay">立即支付</button>
										<!-- <button class="order-btu3 button" data-gid="{{item.GoodsId}}" data-acid="{{item.Acid}}" bindtap="onRefund2">放弃活动</button> -->
									</view>
								</view>
								<view class="explain" v-else>
									<text class="prompt exp-text1">秒杀完成，等待商家出货</text>
									<view class="btu" v-if="item.IsDelete!=true">
										<button class="order-btu3 button" :data-FItemId="item.OrderId"
											bindtap="onHistory">查看核销码</button>
									</view>
								</view>
							</view>
							<view class="explain" v-else>
								<text class="prompt exp-text2">活动已结束</text>
							</view>
						</view>
					</view>
					<view class="order-box" v-else>暂无数据</view>
				</swiper-item>
				<swiper-item item-id="2">
					<view v-if="bargainList!=''">
						<view class="order-box" v-for="(item,index) in bargainList" :key="index">
							<text class="tiem">{{item.Time}}</text>
							<view class="information" bindtap="onJump" :data-AcType="item.AcType"
								:data-ChildId="item.ChildId" :data-Acid="item.Acid" :data-IsDelete="item.IsDelete"
								:data-ProWxid="item.ProWxid">
								<image class="order-img" mode="aspectFit" :src="item.Img"></image>
								<view class="mation">
									<text class="title">{{item.Name}}</text>
									<view class="price">
										<text>底价:¥{{item.AcPrice}}</text>
										<text>原价:¥{{item.Price}}</text>
									</view>
								</view>
							</view>
							<view v-if="item.IsDelete==false">
								<view class="explain" v-if="item.OrderStatus=='新单'">
									<text class="prompt exp-text2">邀好友帮忙砍价,成功后,再请先支付</text>
									<view class="btu">
										<button class="bargain-but2 button" :data-AcType="item.AcType" :data-id="index"
											:data-ChildId="item.ChildId" :data-Acid="item.Acid"
											:data-user="item.CreateUid" :data-ProWxid="item.ProWxid"
											open-type='share'>分享</button>
									</view>
								</view>
								<view class="explain" v-else-if="item.OrderStatus=='成功'">
									<text class="prompt exp-text2">砍价中，邀请好友帮忙砍价吧！ </text>
									<view class="btu">
										<button class="bargain-but2 button" :data-AcType="item.AcType" :data-id="index"
											:data-ProWxid="item.ProWxid" bindtap="onWay">立即支付</button>
									</view>
								</view>
								<view class="explain" v-else-if="item.OrderStatus=='完成'">
									<text class="prompt exp-text2">砍价成功 <text
											v-if="item.IsDelete==true">(活动已结束)</text></text>
									<view class="btu" v-if="item.IsDelete!=true">
										<button class="order-btu3 button" :data-FItemId="item.OrderId"
											bindtap="onHistory">查看核销码</button>
									</view>
								</view>
								<view class="explain" v-else-if="item.OrderStatus=='取消'">
									<text class="prompt exp-text2">砍价失败，活动已取消</text>
								</view>
								<view class="explain" v-else>
									<text class="prompt exp-text2">砍价失败</text>
									<view class="btu" v-if="item.IsDelete!=true">
										<button class="order-btu3 button" bindtap="onJump">再来一单</button>
										<!-- <button class="bargain-but2 button" bindtap="">立即评价</button> -->
									</view>
								</view>
							</view>
							<view class="explain" v-else>
								<text class="prompt exp-text2">活动已结束</text>
							</view>
						</view>
					</view>
					<view class="order-box" v-:else>暂无数据</view>
				</swiper-item>
				<swiper-item item-id="3">
					<view v-if="totalList!=''">
						<view class="order-box" v-for="(item,index) in totalList" :key="index">
							<text class="tiem">{{item.FMdfDate}}</text>
							<view class="information" :data-FItemId="item.FItemId" bindtap="onHistory">
								<image mode="aspectFit" class="order-img" :src="item.FPicUrl"></image>
								<view class="mation">
									<text class="title">{{item.FName}}</text>
									<view class="price exp-text2">
										<text>底价:¥{{item.FAmt}}</text>
										<text>原价:¥{{item.FPosPrice}}</text>
									</view>
								</view>
							</view>
							<view class="explain">
								<text
									class="prompt exp-text1">{{item.FAcType==1?'拼团成功':(item.FAcType==2?'秒杀成功':'砍价成功')}}</text>

								<view class="btu">
									<button class="order-btu3 button" :data-FItemId="item.FItemId"
										bindtap="onHistory">查看核销码</button>
								</view>
							</view>
						</view>
					</view>
					<view class="order-box" v-else>暂无数据</view>
				</swiper-item>
			</swiper>
		</view>

		<!-- <view class="footer">
	    <view class="page-footer">
	      <image class="footer-img" src="http://minipos.posyun3721.com/image/marketing/loog.png"></image>
	      <text>商拓软件提供技术支持</text>
	    </view>
	  </view> -->
	</view>
</template>

<script>
	let pageIndex = 1,
		loadingType = 'more'; //加载更多状态
	export default {
		data() {
			return {
				loginType: 0,
				list: ['我的拼团', '我的秒杀', '我的砍价', '历史订单'],
				swiperHeight: null, //swiper动态高度
				id: 0, //
				totalList: '', //总列表
				groupList: '', //拼团列表
				bargainList: '', //砍价列表
				seckillList: '', //秒杀列表
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			if (options) {
				this.id = options.id;
			}
		},

		onShow: function() {
			uni.showLoading({
				title: '加载中',
			})
			this.tiem();
			let self = this;
			//获取用户当前参与活动
			this.$util.util('Sale/ActivityData', {}, 'POST').then(res => {
				//console.log(res);
				/**
				 * CutPrice 砍价
				 * GroupSale 拼团
				 * Seckill 秒杀
				 */
				let groupList = res.GroupSale,
					bargainList = res.CutPrice,
					seckillList = res.Seckill,
					arrList = [];
				if (groupList.length != 0 || bargainList.length != 0 || seckillList.length != 0) {
					/**
					 * concat 连接两个或更多的数组，并返回结果
					 * for循环 for( var i in b){a.push(b[i]);}
					 * apply func.apply(obj,argv)，argv是一个数组  如: a.push.apply(a,[4,5,6]);
					 */
					// totalList: arrList,//总列表
					this.groupList = res.GroupSale; //拼团列表
					this.bargainList = res.CutPrice; //砍价列表
					this.seckillList = res.Seckill; //秒杀列表
					//swiper组件的动态高度
					let list = '';
					if (this.id == 0) {
						list = self.groupList //拼团
					} else if (this.id == 1) {
						list = self.seckillList //秒杀
					} else if (this.id == 2) {
						list = self.bargainList //砍价         
					} else {
						list = self.totalList //历史
					}
					this.swiperHenght(list);
				}
				uni.hideLoading();
			}).catch(error => {
				//console.log(error)
				if (error.errMsg != 'request:fail timeout') {
					uni.showToast({
						title: error.data.data,
						icon: 'none',
						duration: 2000,
					})
				}
			});
			//历史订单
			this.$util.util('Sale/OrderQuery', {
				page: 1,
				size: 50
			}, 'POST').then(res => {
				loadingType = res.length < 20 ? 'nomore' : 'more';
				res.sort(function(a, b) {
					return (new Date(b.FMdfDate)).getTime() < (new Date(a.FMdfDate)).getTime() ? -1 : 1
					// return b.FMdfDate < a.FMdfDate ? -1 : 1
				})
				//console.log(res);
				self.totalList = res; //总列表
			}) //.catch(error=>//console.log(error));
		},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {
			var self = this;
			if (this.id == 3) {
				if (loadingType === 'nomore') {
					uni.showToast({
						title: '没有更多数据了',
						icon: 'none',
						duration: 2000,
					})
					return;
				}
				pageIndex += 1; //页码++
				this.$util.util('Sale/OrderQuery', {
					page: pageIndex,
					size: 50
				}, 'POST').then(res => {
					//console.log(res);
					//两个数组合并为新的数组
					let self_data = self.totalList.concat(res);
					self_data.sort(function(a, b) {
						return (new Date(b.FMdfDate)).getTime() < (new Date(a.FMdfDate)).getTime() ? -
							1 : 1
						// return b.FMdfDate < a.FMdfDate ? -1 : 1
					})
					self.totalList = self_data;
					loadingType = res.length == 0 || res.length < 20 ? 'nomore' : 'more';
					this.swiperHenght(self_data);
				}) //.catch(error=>//console.log(error));
			}

		},
		methods: {

			onShareAppMessage: function(e) {
				//console.log(e);
				let Sharedata = this.$util.onShare(),
					actype = e.target.dataset.actype,
					distributor = e.target.dataset.prowxid;
				Sharedata.share = 0;
				Sharedata.id = actype == 1 ? 0 : (actype == 2 ? 1 : 2);
				Sharedata.groupId = e.target.dataset.acid;
				Sharedata.childId = e.target.dataset.childid;
				Sharedata.uid = e.target.dataset.user;
				Sharedata.distributor = distributor;
				//console.log(Sharedata)
				debugger
				Sharedata = JSON.stringify(Sharedata);
				let pageUrl = '/pages/Marketing/index/select/select' + actype + '/select' + actype + '?Sharedata=' + Sharedata + '&share=0';
				return {
					title: '快来一起参加活动',
					path: pageUrl // 路径，传递参数到指定页面。
				}
			},
			//跳转子类活动的详情页面
			onJump: function(e) {
				//console.log('跳转', e);
				let type = e.currentTarget.dataset.actype,
					selectid = e.currentTarget.dataset.actype,
					Acid = e.currentTarget.dataset.acid,
					ChildId = e.currentTarget.dataset.childid,
					IsDelete = e.currentTarget.dataset.isdelete,
					ProWxid = e.currentTarget.dataset.prowxid,
					id = 1;
				if (IsDelete != true) {
					if (type == 2) {
						uni.setStorageSync('GoodsId', ChildId);
					}
					let distributor = ProWxid != '' ? ProWxid : '';
					type = type == 1 ? '0' : (type == 2 ? '1' : '2');
					if (ChildId != null) {
						uni.navigateTo({
							url: '/pages/Marketing/index/select/select' + selectid + '?id=' + type + '&Acid=' +
								Acid + '&ChildId=' + ChildId + '&AcChild=' + id + '&distributor=' +
								distributor,
							fail: err => {
								//console.log(err);
							}
						})
					} else {
						uni.showModal({
							title: '提示',
							content: '该活动已结束',
						})
					}
				}
			},
			tiem: function() {
				var self = this;
				self.loginType = 1;
			},
			onShareAppMessage: function(e) {
				//console.log(e);
				let Sharedata = this.$util.onShare(),
					actype = e.target.dataset.actype,
					distributor = e.target.dataset.prowxid;
				Sharedata.share = 0;
				Sharedata.id = actype == 1 ? 0 : (actype == 2 ? 1 : 2);
				Sharedata.groupId = e.target.dataset.acid;
				Sharedata.childId = e.target.dataset.childid;
				Sharedata.uid = e.target.dataset.user;
				Sharedata.distributor = distributor;
				//console.log(Sharedata)
				debugger
				Sharedata = JSON.stringify(Sharedata);
				let pageUrl = '/pages/Marketing/index/select/select' + actype + '/select' + actype + '?Sharedata=' + Sharedata + '&share=0';
				return {
					title: '快来一起参加活动',
					path: pageUrl // 路径，传递参数到指定页面。
				}
			},
			//跳转子类活动的详情页面
			onJump: function(e) {
				//console.log('跳转', e);
				let type = e.currentTarget.dataset.actype,
					selectid = e.currentTarget.dataset.actype,
					Acid = e.currentTarget.dataset.acid,
					ChildId = e.currentTarget.dataset.childid,
					IsDelete = e.currentTarget.dataset.isdelete,
					ProWxid = e.currentTarget.dataset.prowxid,
					id = 1;
				if (IsDelete != true) {
					if (type == 2) {
						uni.setStorageSync('GoodsId', ChildId);
					}
					let distributor = ProWxid != '' ? ProWxid : '';
					type = type == 1 ? '0' : (type == 2 ? '1' : '2');
					if (ChildId != null) {
						uni.navigateTo({
							url: '/pages/Marketing/index/select/select' + selectid + '?id=' + type + '&Acid=' +
								Acid + '&ChildId=' + ChildId + '&AcChild=' + id + '&distributor=' +
								distributor,
							fail: err => {
								//console.log(err);
							}
						})
					} else {
						uni.showModal({
							title: '提示',
							content: '该活动已结束',
						})
					}
				}
			},
			tiem: function() {
				var self = this;
				self.loginType = 1;
			},
			//秒杀成功后，去支付
			onWay: function(e) {
				//console.log(e);
				let index = e.currentTarget.dataset.id;
				let AcType = e.currentTarget.dataset.actype,
					prowxid = e.currentTarget.dataset.prowxid;
				if (AcType == 3) {
					let data = this.bargainList[index];
					//console.log('砍价', data);

					if (parseInt(data.AcQty) == parseInt(data.GroupQty)) {
						this.address(index, AcType);
					} else {
						uni.showModal({
							title: '提示',
							content: '参与砍价人数不足，先邀请好友帮忙砍价',
						})
					}
				} else {
					this.address(index, AcType, prowxid);
				}
			},
			//获取收货地址
			address: function(id, Type, prowxid) {
				let self = this,
					datas = '',
					usersActAmt = '',
					ChildId;
				if (Type == 2) {
					datas = self.seckillList[id];
					ChildId = datas.GoodsId;
				} else {
					datas = self.bargainList[id];
					ChildId = datas.ChildId;
				}

				//console.log(datas);
				datas = JSON.stringify(datas);

				this.$util.util('WxUserInfo/GetAddress', {}, 'POST').then(res => {
					//console.log(res);
					if (res != '[]') {
						uni.navigateTo({
							url: '/pages/Marketing/index/pay/pay?id=' + self.id + '&goodsData=' +
								datas + '&addressId=' + res[0].FItemID + '&childType=1&childId=' +
								ChildId + '&distributor=' + prowxid,
						})
					} else {
						uni.showModal({
							title: '提示',
							content: '您还没有填写您的详细地址，请前往个人中心填写',
						})
					}
				}) //.catch(error=>//console.log(error));
			},
			//导航的切换
			onSwitch: function(e) {
				//console.log(e)
				let id = e.target.dataset.id;
				this.id = e.target.dataset.id;
				//swiper组件的动态高度
				let list = '';
				let self = this;
				if (id == 0) {
					list = self.groupList //拼团
				} else if (id == 1) {
					list = self.seckillList //秒杀
				} else if (id == 2) {
					list = self.bargainList //砍价
				} else {
					list = self.totalList //历史
				}
				this.swiperHenght(list);
			},
			//swiper组件的切换
			onSwiper: function(e) {
				//console.log(e)
				var index = e.detail.current
				this.id = index;
				//swiper组件的动态高度
				let list = '';
				let self = this;
				if (index == 0) {
					list = self.groupList //拼团
				} else if (index == 1) {
					list = self.seckillList //秒杀
				} else if (index == 2) {
					list = self.bargainList //砍价
				} else {
					list = self.totalList //历史
				}
				this.swiperHenght(list);
			},
			//再来一次
			onAgain: function(e) {
				//console.log(e);

				let id = e.currentTarget.dataset.id,
					acid = e.currentTarget.dataset.acid;
				let type = id == 1 ? '0' : (id == 2 ? '1' : '2')
				uni.navigateTo({
					url: '/pages/Marketing/index/select/select' + id + '?id=' + type + '&goodID=' + acid,
				})
			},
			//动态高度
			swiperHenght: function(list) {
				let self = this;

				let number = list.length == 0 ? '1' : list.length;
				const query = uni.createSelectorQuery()
				query.select('.order-box').boundingClientRect()
				query.exec(function(res) {
					let sumHeigth = (res[0].height + 10) * number;
					self.swiperHeight = sumHeigth + 'px';
				})
			},
			onHistory: function(e) {
				//console.log(e.currentTarget.dataset.fitemid);
				uni.navigateTo({
					url: '/pages/Marketing/index/pay/pay?id=' + 5 + '&fitemid=' + e.currentTarget.dataset
						.fitemid,
					fail: err => {
						//console.log(err);
					}
				})
			},
			//
			onRefund2(e) {
				let gid = e.currentTarget.dataset.gid,
					id = e.currentTarget.dataset.acid;
				this.$util.util('Sale/SeckillCancel', {
					acid: id,
					goodsid: gid
				}, 'POST').then(res => {
					//console.log(res);
				}).catch(error => {
					//console.log(error);
					uni.showModal({
						title: '提示',
						content: error.data.data || '申请失败'
					})
				})
			},
			onRefund1(e) {
				let gid = e.currentTarget.dataset.gid,
					cid = e.currentTarget.dataset.cid,
					url = 'Sale/GroupReturn'; //'Sale/GroupCancel'userInfo = app.globalData.userInfo;
				this.$util.util(url, {
					groupid: gid,
					childid: cid
				}, 'POST').then(res => {
					//console.log(res);
				}).catch(error => {
					//console.log(error);
					uni.showModal({
						title: '提示',
						content: error.data.data
					})
				})
			},
		}
	}
</script>

<style>
	/* pages/aboutUs/order/order.wxss */
	swiper {
		height: 1150px;
	}

	page {
		background-color: #F9F9F9;
	}

	.content {
		width: 100%;
		height: auto;
	}

	.head {
		width: 100%;
		height: 90rpx;
		line-height: 90rpx;
		background-color: #fff;
		box-shadow: 0px 6px 6px rgba(21, 51, 77, 0.05);
		margin-bottom: 20rpx;
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-around;

		position: fixed;
		top: 0;
		z-index: 100;
	}

	.head>text {
		color: #999999;
		font-size: 32rpx;
	}

	.order-active {
		color: #FF892E;
		border-bottom: 6rpx solid #FF892E;
	}

	.main {
		width: 100%;
		height: auto;
		margin-top: 110rpx;
	}

	.order-box {
		height: 428rpx;
		padding: 0 23rpx;
		margin-bottom: 20rpx;
		background-color: #fff;
		box-shadow: 0px 6px 12px rgba(23, 68, 159, 0.05);
	}

	.tiem {
		color: #333;
		font-size: 24rpx;
		line-height: 32rpx;
		margin-left: 20rpx;
		padding: 24rpx 0;
		margin-bottom: 14rpx;
		display: block;
	}

	.information {
		width: 100%;
		height: 240rpx;
		border-bottom: 2rpx solid #F1F1F1;
		border-top: 2rpx solid #F1F1F1;
	}

	.order-img {
		width: 148rpx;
		height: 148rpx;
		float: left;
		display: block;
		margin: 20rpx;
		background-color: #EBEBEB;
	}

	.mation {
		width: 480rpx;
		float: left;
		margin: 20rpx 0;
	}

	.title {
		color: #333;
		font-size: 24rpx;
		line-height: 32rpx;
		display: block;
		margin-bottom: 20rpx;
	}

	.price>text:first-child {
		color: #FF2741;
		font-size: 28rpx;
		line-height: 38rpx;
		display: block;
		margin-bottom: 8rpx;
	}

	.price>text:last-child {
		color: #BABABA;
		font-size: 28rpx;
		line-height: 38rpx;
		display: block;
		text-decoration: line-through;
	}

	.explain {
		width: 100%;
		height: 94rpx;
	}

	.prompt {
		font-size: 28rpx;
		line-height: 94rpx;
		display: block;
		float: left;
		margin-left: 20rpx;
	}

	.exp-text1 {
		color: #FF2741;
	}

	.exp-text2 {
		color: #707070;
	}

	.btu {
		width: auto;
		height: 60rpx;
		margin: 17rpx 0;
		float: right;
		display: block;
	}

	.btu .button {
		width: 164rpx;
		height: 60rpx;
		line-height: 60rpx;
		font-size: 28rpx;
		float: left;
		padding: 0rpx;
	}

	.btu>button:first-child {
		margin-right: 20rpx;
	}

	.order-btu1 {
		color: #FF892E;
		border: 2rpx solid #FF892E;
		background-color: #fff;
	}

	.order-btu2 {
		background-color: #FF892E;
		color: #fff;
	}

	.order-btu3 {
		color: #707070;
		background-color: #fff;
		border: 2rpx solid #707070;
	}

	.seckill-but1 {
		color: #5864DA;
		border: 2rpx solid #5864DA;
		background-color: #fff;
	}

	.seckill-but2 {
		background-color: #5864DA;
		color: #fff;
	}

	.bargain-but1 {
		color: #B52FE8;
		border: 2rpx solid #B52FE8;
		background-color: #fff;
	}

	.bargain-but2 {
		background-color: #B52FE8;
		color: #fff;
	}
</style>
